<template>
  <div>
    <div class="margin-bottom-15">
      <div class="text-white margin-right-5">
        设备信息
      </div>
      <split-vline class="margin-left-15 margin-right-15" />
      <add-button class="margin-left-8" :on-click="addInput" />
    </div>
    <el-table-block2 :column="column" :data="rows" border />
    <!--设备信息编辑-->
    <equipment-drawer ref="EquipmentInfoInput1" />
  </div>
</template>

<script>
import EquipmentDrawer from '@/views/reservoir/shuiYuQingJianCe/siteManagement/components/EquipmentDrawer'

export default {
  name: 'EquipmentManger',
  components: {
    EquipmentDrawer
  },
  data() {
    return {
      column: [
        { label: '设备名称', prop: '名称', align: 'center' },
        { label: '设备编号', prop: '编号', align: 'center' },
        { label: '设备MN号', prop: 'N号', align: 'center' },
        { label: '启用日期', prop: '日期', align: 'center' },
        { label: '设备状态', prop: '状态', align: 'center' },
        { label: '监测项目', prop: '项目', align: 'center' },
        {
          label: '操作',
          prop: '操作',
          align: 'center',
          renderBody: (h, { row, $index }) => {
            return (
              <div>
                <el-link
                  type="primary"
                  class="color-base"
                  onClick={() => {
                    this.showInput(row)
                  }}
                >
                  编辑
                </el-link>
                <split-vline class="margin-left-15 margin-right-15"></split-vline>
                <el-link
                  type="primary"
                  class="color-base"
                  onClick={() => {
                    this.removeRow(row)
                  }}
                >
                  删除
                </el-link>
              </div>
            )
          }
        }
      ],
      rows: Array.from({ length: 5 }, () => ({
        date: '2020-05-02',
        name: '韩小寒',
        address: '陕西省西安市高新区汇鑫IBC'
      }))
    }
  },
  methods: {
    removeRow() {
      this.$confirm('确定删除吗？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {})
    },
    addInput() {
      this.showInput(null)
    },
    showInput(row) {
      this.$refs.EquipmentInfoInput1.open(row)
    }
  }
}
</script>

<style scoped></style>
